<template>
  <div class="app-container">
    <div style="display: flex;">
      <div style="display: flex;width: 40%;flex-direction: column">
        <el-form label-width="120px">
          <el-form-item label="资产标签">
            <el-input v-model="formSj.asset_tag" placeholder="请输入资产标签" />
          </el-form-item>
          <el-form-item label="选择位置">
            <ChooseLocation @commitLocationMethod="commitLocationMethod"></ChooseLocation>
          </el-form-item>
          <el-form-item label="下次盘点时间" prop="check_date">
            <el-date-picker
              v-model="formSj.check_date"
              clearable
              size="small"
              type="date"
              value-format="yyyy-MM-dd"
              placeholder="选择下次盘点时间"
            >
            </el-date-picker>
          </el-form-item>
          <el-form-item label="备注" prop="checkout_notes">
            <el-input v-model="formSj.notes" type="textarea" placeholder="请输入内容" />
          </el-form-item>
        </el-form>
        <div slot="footer" class="dialog-footer">
          <el-button style="margin-left: 90%" type="primary" @click="borrowClick()">审计</el-button>
        </div>
      </div>
      <div style="flex: 1;background: #fff;margin-left: 30px">
        盘点状态 (1:已盘点资产 0:盘点失败)
        <el-table v-loading="loading" :data="assetListStatus" style="margin-top: 30px">
          <el-table-column width="300" label="资产标签" align="left" prop="assetTag"></el-table-column>
          <el-table-column width="300" label="盘点状态" align="left" prop="status">
            <template slot-scope="scope">
              <div v-if="scope.row.status === 1">盘点成功</div>
              <div v-if="scope.row.status === 0">盘点失败 原因：资产不存在</div>
            </template>
          </el-table-column>
          <el-table-column width="300" label="状态码" align="left" prop="status"></el-table-column>
        </el-table>
      </div>
    </div>
  </div>
</template>

<script>

import ChooseLocation from "@/views/components/ChooseLocation";
import { listUser } from "@/api/vadmin/permission/user";
import { audit, listAsset } from "@/api/vadmin/assets/assets";

export default {
  name: "Maintain",
  components: { ChooseLocation },
  data() {
    return {
      formSj: {
        asset_tag: null,
        check_date: null,
        notes: null,
        location: null
      },
      assetList: [],
      assetListCan: [],
      roleList: [],
      toType: "用户",
      returnData: {
        asset_tag: null,
        assigned_to: null,
        check_date: null,
        notes: ""
      },
      assetListStatus: []
    };
  },
  created() {
  },
  mounted() {
    listUser().then(response => {
      this.roleList = response.data.results;
    });
    listAsset().then(response => {
      this.assetList = response.data.results;
      this.assetListCan = this.assetList.filter(item => {
        if (!item.assigned_to && item.status === "deployable") {
          return item;
        }
      });
    });
  },
  methods: {
    commitLocationMethod(val) {
      this.formSj.location = val;
    },
    borrowClick() {
      if (!this.formSj.asset_tag) {
        this.$message.error("资产标签不能为空");
        return;
      }
      if (!this.formSj.check_date) {
        this.$message.error("资产审计时间不能为空");
        return;
      }
      if (!this.formSj.location) {
        this.$message.error("位置不能为空");
        return;
      }
      var x = { asset_tag: this.formSj.asset_tag, location_id: this.formSj.location, notes: this.formSj.notes, next_audit_date: this.formSj.check_date };
      audit(x).then(res => {
        this.$message({
          message: "审计成功",
          type: "success"
        });
        this.assetListStatus.push({
          assetTag: this.formSj.asset_tag,
          status: 1
        });
      }, error => {
        this.assetListStatus.push({
          assetTag: this.formSj.asset_tag,
          status: 0
        });
      });
    }
  }
};
</script>
<style>
</style>
